<template>
  <div class="lesson-detail">
    <!-- 头部 -->
    <course-detail-header v-if="detail" :base="detail" />

    <!-- 内容部分 -->
    <course-detail-content
            v-if="Object.keys(detail).length"
            :data="detail"
            :teacher="teacher"
            :description="description"
            :recommend-list="recommend"
    />
  </div>
</template>
<script>
import CourseDetailHeader from './course-detail-header.vue'
import CourseDetailContent from './course-detail-content.vue'

import { getTeacherByCourseId, getCourseDetailById, getRecommendCourseById, getCourseDescriptionById } from '@/api/courseDetail'
export default {
  data () {
    return {
      detail: {}, // 课程详情数据
      teacher: {}, // 讲师信息
      description: {}, // 课程描述
      recommend: [], // 推荐课程信息
    }
  },
  created () {
    this.getCourseDetailData()
    this.getTeacher()
    this.getRecommend()
    this.getDescription()
  },
  methods: {
    // 获取课程详情
    getCourseDetailData () {
      getCourseDetailById(this.$route.params.id).then(result => {
        let { code, data } = result
        if (code === 20000) {
          this.detail = data.item
        }
        else {
          this.$router.push('/404')
        }
      })
    },

    //获取课程所属讲师信息
    getTeacher(){
      getTeacherByCourseId(this.$route.params.id).then(result => {
        let { code, data } = result
        if (code === 20000) {
          this.teacher = data.item
        }
      })
    },

    //获取课程同一类别的推荐课程
    getRecommend(){
      getRecommendCourseById(this.$route.params.id).then(result => {
        let { code, data } = result
        if (code === 20000) {
          this.recommend = data.items
        }
      })
    },

    //获取课程描述
    getDescription(){
      getCourseDescriptionById(this.$route.params.id).then(result => {
        let { code, data } = result
        if (code === 20000) {
          this.description = data.item
        }
      })
    },

  },
  components: {
    CourseDetailHeader,
    CourseDetailContent
  }
}
</script>
